<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="zxx">

<head>
	<title>主页</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta charset="UTF-8" />
	<meta name="keywords" content="" />
	<script>
		addEventListener("load", function () {
			setTimeout(hideURLbar, 0);
		}, false);

		function hideURLbar() {
			window.scrollTo(0, 1);
		}
	</script>

	<!-- 设置网页图标 -->
	<link rel="shortcut icon" href="images/browserLOGO2.png" type="image/x-icon" />
	<link rel="stylesheet" href="css/bootstrap.css">
	<!-- 引用Bootstrap -->
	<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
	<link rel="stylesheet" href="css/fontawesome-all.css">
	<link rel="stylesheet" href="css/owl.theme.css" type="text/css" media="all">
	<link rel="stylesheet" href="css/owl.carousel.css" type="text/css" media="screen" property="" />

	<!-- 网页字体库 -->
	<link href="http://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&amp;subset=devanagari,latin-ext"
	 rel="stylesheet">
	<link href="http://fonts.googleapis.com/css?family=Tangerine:400,700" rel="stylesheet">
	<link href="http://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet">
</head>

<body>
	<div class="main-sec" id="home">

		<!-- header -->
	
	
		<!-------------------------------------->
		<!------------ 顶部Logo和导航栏  ------------>
		<!-------------------------------------->
		<%@include file="jsp/header.jsp" %>
		<!-------------------------------------->
		<!-------------------------------------->

		<!-- banner-text -->
		<div class="slider">
			
			<!-------------------------------->
			<!------------ 顶部轮播图  ------------>
			<!-------------------------------->
			<%@include file="jsp/imageAct.jsp" %>
			<!-------------------------------->
			<!-------------------------------->
			
			<div class="clearfix"></div>
			<!-- 下滑按钮-->
			<div class="thim-click-to-bottom">
				<div class="rotate">
					<a href="#about" class="scroll" style="width: 100%;">
						<i class="fas fa-angle-double-down"></i>
					</a>
				</div>
			</div>
			<!-- //下滑按钮-->
			<div class="blog-grid-w3-agileits py-5" id="about">
				<div class="container py-xl-5 py-lg-3">
					<div class="row banner-bott px-sm-0 px-3">
						<div class="col-md-6 blog-info-w3layouts">
							<div class="inner-info-w3ls">
								<h5>瑜伽能帮助您达到身体、心灵与精神和谐统一</h5>
								<p class="para-agileits">瑜伽，不仅只是一套流行或时髦的健身运动这么简单。瑜伽是一个非常古老的能量知识修炼方法，集哲学、科学和艺术于一身。瑜伽的基础建立在古印度哲学上，数千年来，心理、生理和精神上的戒律已经成为印度文化中的一个重要组成部分。古代的瑜伽信徒发展了瑜伽体系，因为他们深信通过运动身体和调控呼吸，可以控制心智和情感，以及保持健康的身体。</p>
							</div>
						</div>
						<div class="col-md-6 blog-img1-agileits-w3layouts">
							<span></span>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<!-- 正文内容 -->
	<section class="banner-bottom py-5">
		<div class="py-xl-5 py-lg-3">
			<h3 class="tittle text-dark text-center font-weight-bold mb-lg-5 mb-4">何为瑜伽？</h3>
			<div class="tabs">
				<div class="container" >
					<ul class="nav nav-pills my-4" id="pills-tab" role="tablist">
							<li class="nav-item">
								<a class="nav-link tabs-w3ls" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile"
								 aria-selected="false">
									<i class="fab fa-yelp"></i>益处</a>
							</li>
							<li class="nav-item"></li>
							<li class="nav-item">
								<a class="nav-link tabs-w3ls active" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-profile"
								 aria-selected="false">
									<i class="fab fa-forumbee"></i>历史</a>
							</li>
							<li class="nav-item"></li>
							<li class="nav-item">
								<a class="nav-link tabs-w3ls" data-toggle="pill" href="#pills-profile2" role="tab" aria-controls="pills-profile"
								 aria-selected="false">
									<i class="fab fa-audible"></i>发展</a>
							</li>
					</ul>
				</div>
				<div class="tab-content mt-sm-5" id="pills-tabContent">
					<div class="tab-pane fade show active" id="pills-home" role="tabpanel">
						<div class="menu-grids pt-4">
							<div class="d-flex t-in">
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/coach-red.png" alt="哦豁" class="img-fluid" />
								</div>
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">起源</h5>
										<p class="whats-text">瑜伽起源于印度，距今有五千多年的历史文化被人们称为“世界的瑰宝”。瑜伽发源印度北部的喜马拉雅山麓地带，古印度瑜伽修行者在大自然中修炼身心时，无意中发现各种动物与植物天生具有治疗、放松、睡眠、或保持清醒的方法，患病时能不经任何治疗而自然痊愈。于是古印度瑜伽修行者根据动物的姿势观察、模仿并亲自体验，创立出一系列有益身心的锻炼系统，也就是体位法。这些姿势历经了五千多年的锤炼，瑜伽教给人们的治愈法，让世世代代的人从中获益。</p>
									</div>
								</div>
							</div>
							<div class="d-flex t-in mt-5">
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in-2">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">Yoga</h5>
										<p class="whats-text">Yoga这个词，是从印度梵语“yug”或“yuj”而来，其含意为“一致”、“结合”或“和谐”。瑜伽源于古印度，是古印度六大哲学派别中的一系，探寻“梵我合一”的道理与方法。而现代人所称的瑜伽则是主要是一系列的修身养心方法。大约在公元前300年，印度的大圣哲瑜伽之祖帕坦伽利创作了《瑜伽经》，印度瑜伽在其基础上才真正成形，瑜伽行法被正式订为完整的八支体系。瑜伽是一个通过提升意识，帮助人类充分发挥潜能的体系。瑜伽姿势运用古老而易于掌握的技巧，改善人们生理、心理、情感和精神方面的能力，是一种达到身体、心灵与精神和谐统一的运动方式，包括调身的体位法、调息的呼吸法、调心的冥想法等，以达至身心的合一。</p>
									</div>
								</div>
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/coach-blue.png" alt=" " class="img-fluid" />
								</div>
							</div>
						</div>
					</div>
					<div class="tab-pane fade" id="pills-profile" role="tabpanel">
						<div class="menu-grids pt-4">
							<div class="d-flex t-in">
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in-2">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">生理修复</h5>
										<p class="whats-text">作为一种非常古老的能量知识修炼方法，“瑜伽”并非只是一套流行或时髦的健身运动这么简单。现代人吸取其有益精华，发现瑜伽的好处不胜枚举。瑜伽能加速新陈代谢，去除体内废物，形体修复、调理养颜从内及外；瑜伽能带给你优雅气质、轻盈体态，提高人的内外在的气质；瑜伽能增强身体力量和肌体弹性，身体四肢均衡发展，使你变得越来越开朗、活力、身心愉悦；瑜伽能预防和治疗各种身心相关的疾病，背痛、肩痛、颈痛、头痛、关节痛、失眠、消化系统紊乱、痛经、脱发等都有显著疗效；瑜伽能调节身心系统，改善血液环境，促进内分泌平衡，内在充满能量。</p>
									</div>
								</div>
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/benefit-blue.png" alt=" " class="img-fluid" />
								</div>
							</div>
							<div class="d-flex t-in mt-5">
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/benefit-red.png" alt=" " class="img-fluid" />
								</div>
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">心理调养</h5>
										<p class="whats-text">瑜伽来源于古印度的六大哲学派系之一，思想上提倡积极向上。瑜伽中的某些思想，吻合了宗教的一些思想，和东方的先哲圣人思想相碰撞。与他们结伴而行，吸取到的精华必定使自己成长的飞速。此外科学研究表明由于瑜伽使包括脑部在内的腺体神经系统产生回春效果，心智情绪会呈现积极状态。它使你更有自信，更热诚，而且比较乐观。每天的生活也会变得更有创意。</p>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="tab-pane fade" id="pills-profile2" role="tabpanel">
						<div class="menu-grids pt-4">
							<div class="d-flex t-in">
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in-2">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">古典瑜伽</h5>
										<p class="whats-text">由公元前1500年《吠陀经》笼统的记载下来，到了《奥义书》明确的记载瑜伽，到《薄伽梵歌》出现，完成了瑜伽行法与吠檀多哲学的合一，使瑜伽这一民间的灵修实践变为正统，由强调行法到行为、信仰、知识三者并行不悖。传说中， 帕坦伽利的母亲哥妮卡是个饱学的瑜伽行者，她一直希望将所学传给一位贤能之士但未能如愿。哥妮卡心里想说她的生命所剩无几，她就向太阳神祈求，希望可以赐给她一位所寻觅的贤者。她双手捧水闭眼向太阳神祷告，正当她要献水给太阳神时，她睁眼看到手中有一条小蛇，小蛇瞬间化成人形，向她说：“我想做你的孩子。”哥妮卡答应了，并为他取名Patanjali。Pat的意思是掉落，an'jali的意思是双手合十，因为帕坦伽利就像由天掉落至她手中的人，所以就取名为Patanjali</p>
									</div>
								</div>
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/friend-blue.png" alt="哦豁" class="img-fluid" />
								</div>
							</div>
							<div class="d-flex t-in mt-5">
								<div class="col-lg-6 text-info-sec p-0">
									<img src="images/modern-red.png" alt="哦豁" class="img-fluid" />
								</div>
								<div class="col-lg-6 text-info-sec mt-5">
									<div class="service-in">
										<h6>Woniu Yoga</h6>
										<h5 class="what-title text-uppercase my-3">现代瑜伽</h5>
										<p class="whats-text">瑜伽发展到了今天，已经成为世界广泛传播的一项身心锻炼修习法。从印度传至欧美、亚太、非洲等等，因为它对心理的减压以及对生理的保健等明显作用而备受推崇。同时不断演变出了各种各式的瑜伽分支方法，比如热瑜伽、哈他瑜伽、高温瑜伽、养生瑜伽等等，以及一些瑜伽管理科学。在现代，也产生了一些在全球具有广泛影响力的瑜伽大师 ，例如室利·阿罗频多、辨喜、艾扬格、斯瓦米·兰德福、张蕙兰等。不可否认，悠久的瑜伽将会更加受到各界人士的喜爱。</p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- //正文 -->

	<!-- 教练推荐 -->
	<section class="news py-5" id="clients">
		<div class="container py-xl-5 py-lg-3">
			<h3 class="tittle text-white text-center font-weight-bold mb-lg-5 mb-4">金牌教练</h3>
			<div class="owl-carousel owl-theme">
				<div class="item">
					<a href="javascript:void(0)">
						<img src="images/待定.jpg" alt="" class="img-fluid">
					</a>
					<div class="feedback-info bg-white p-4">
						<h4 class="mb-2">
							<a href="javascript:void(0)" class="text-dark">推荐标题</a>
						</h4>
						<p>哇这个教练好厉害姿势真多（滑稽）</p>
						<div class="feedback-grids mt-4">
							<div class="feedback-img">
								<img src="images/头像2.png" class="img-fluid rounded-circle" alt="" />
							</div>
							<div class="feedback-img-info">
								<h5>教练名</h5>
								<p>18 June 2018</p>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="item">
					<a href="javascript:void(0)">
						<img src="images/待定.jpg" alt="" class="img-fluid">
					</a>
					<div class="feedback-info bg-white p-4">
						<h4 class="mb-2">
							<a href="javascript:void(0)" class="text-dark">推荐标题</a>
						</h4>
						<p>哇这个教练好厉害姿势真多（滑稽）</p>
						<div class="feedback-grids mt-4">
							<div class="feedback-img">
								<img src="images/头像1.png" class="img-fluid rounded-circle" alt="" />
							</div>
							<div class="feedback-img-info">
								<h5>教练名</h5>
								<p>16 July 2018</p>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="item">
					<a href="javascript:void(0)">
						<img src="images/待定.jpg" alt="" class="img-fluid">
					</a>
					<div class="feedback-info bg-white p-4">
						<h4 class="mb-2">
							<a href="javascript:void(0)" class="text-dark">推荐标题</a>
						</h4>
						<p>哇这个教练好厉害姿势真多（滑稽）</p>
						<div class="feedback-grids mt-4">
							<div class="feedback-img">
								<img src="images/头像3.png" class="img-fluid rounded-circle" alt="" />
							</div>
							<div class="feedback-img-info">
								<h5>教练名</h5>
								<p>18 July 2018</p>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- //教练推荐 -->

	<!-- 图片展示 -->
	<div class="portfolio-project text-center py-5" id="gallery">
		<div class="container py-xl-5 py-lg-3">
			<h3 class="tittle text-dark text-center font-weight-bold mb-lg-5 mb-4">瑜伽风采</h3>
			<div class="row inner_sec_info_agile-w3ls">
				<div class="col-md-6 portfolio-grids sec_img pl-0" data-aos="zoom-in">
					<a href="images/show2.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
						<img src="images/show2.jpg" class="img-fluid" alt="哦豁" />
						<div class="b-wrapper">
							<h4>Yoga</h4>
						</div>
					</a>
				</div>
				<div class="col-md-6 portfolio-grids_left gallery-items-w3ls p-sm-0 mt-md-0 mt-4">
					<div class="row">
						<div class="col-6 portfolio-grids pr-sm-0" data-aos="zoom-in">
							<a href="images/show1.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/show1.jpg" class="img-fluid" alt="哦豁" />
								<div class="b-wrapper">
									<h4>Yoga</h4>

								</div>
							</a>
						</div>
						<div class="col-6 portfolio-grids gallery-items-w3ls pr-sm-0" data-aos="zoom-in">
							<a href="images/show3.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/show3.jpg" class="img-fluid" alt="哦豁" />
								<div class="b-wrapper">
									<h4>Yoga</h4>

								</div>
							</a>
						</div>
						<div class="col-6 portfolio-grids gallery-items-w3ls pr-sm-0 mt-3" data-aos="zoom-in">
							<a href="images/show4.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/show4.jpg" class="img-fluid" alt="哦豁" />
								<div class="b-wrapper">
									<h4>Yoga</h4>

								</div>
							</a>
						</div>
						<div class="col-6 portfolio-grids gallery-items-w3ls pr-sm-0 mt-3" data-aos="zoom-in">
							<a href="images/show5.jpg" class="b-link-stripe b-animate-go lightninBox" data-lb-group="1">
								<img src="images/show5.jpg" class="img-fluid" alt="哦豁" />
								<div class="b-wrapper">
									<h4>Yoga</h4>
								</div>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- //图片展示 -->

		<!-------------------------------------->
		<!------------- 底部Logo和版权  ------------->
		<!-------------------------------------->
		<%@include file="jsp/footer.jsp" %>
		<!-------------------------------------->
		<!-------------------------------------->


	<script src="js/jquery-2.2.3.min.js"></script>
	<script src="js/responsiveslides.min.js"></script>
	<script src="js/owl.carousel.js"></script>
	<script>
		$(function () {
			//轮播图控制
			$("#slider4").responsiveSlides({
				auto: true,
				pager: true,
				nav: false,
				speed: 1000,
				namespace: "callbacks",
				before: function () {
					$('.events').append("<li>before event fired.</li>");
				},
				after: function () {
					$('.events').append("<li>after event fired.</li>");
				}
			});
			
			//教练推荐部分，根据屏幕大小设置响应式布局
			$('.owl-carousel').owlCarousel({
				loop: true,
				margin: 10,
				responsiveClass: true,
				responsive: {
					0: {
						items: 1,
						nav: true
					},
					600: {
						items: 1,
						nav: false
					},
					768: {
						items: 2,
						nav: false
					},
					1000: {
						items: 3,
						nav: true,
						loop: false,
						margin: 20
					}
				}
			})
		});
	</script>

	
	<!-- 图片展示放大 -->
	<script src="js/jquery.chocolat.js"></script>
	<link rel="stylesheet" href="css/chocolat.css">
	<!--light-box-files -->
	<script>
		$(function () {
			$('.portfolio-grids a').Chocolat();
		});
	</script>

	<script src="js/SmoothScroll.min.js"></script>
	<!-- 页面跳转至顶部 -->
	<script src="js/move-top.js"></script>
	<script src="js/easing.js"></script>
	<script src="js/skater.js"></script>

	<script src="js/bootstrap.js"></script>

</body>

</html>